<!-- 检票设置 -->

<template>
  <el-form
    ref="formRef"
    :model="form.data"
    :disabled="form.status==='r'||form.submitting"
    :label-width="form.show&&isActive?'auto':undefined"
    class="commodity-form-module"
  >
    <!-- 规则：必选 -->
    <el-form-item
      label="门票未检票过期规则"
      prop="expireSetting"
      verify
    >
      <el-select
        style="width: 100%"
        v-model="form.data.expireSetting"
        placeholder="请选择门票未检票过期规则"
      >
        <el-option
          v-for="item in $enum.ENUM_COMMODITY_TICKET_EXPIRE_TYPE"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        />
      </el-select>
    </el-form-item>
    <!-- 规则：必选，范围小于可选游玩日时间后27天 -->
    <el-form-item
      label="自动退/检票期限"
      prop="autoCheckDays"
      verify
      :rules="{
          trigger: ['blur', 'change'],
          validator: (rule, value, callback) => {
              // 1. 可选游玩日期 + 自动退/检票期限 <= 28
              if (
                  form.data.validityBeginTime &&
                  form.data.validityEndTime &&
                  Math.abs(
                      $dayjs(
                          form.data.validityBeginTime
                      ).diff(
                          $dayjs(
                              form.data.validityEndTime
                          ),
                          'day'
                      )
                  ) +
                      1 +
                      parseFloat(
                          form.data.autoCheckDays
                      ) >
                      28
              ) {
                  callback(
                      '过期退/过期检时间 + 可选游玩日期范围应小于等于28天'
                  )
                  return
              }
              // 2. 可选游玩天数 + 自动退/检票期限 <= 28
              if (
                  form.data.validityDays &&
                  parseFloat(form.data.validityDays) +
                      parseFloat(
                          form.data.autoCheckDays
                      ) >
                      28
              ) {
                  callback(
                      '过期退/过期检时间 + 可选游玩天数应小于等于28天'
                  )
                  return
              }
              // 自动退/检票期限>=门票有效期
              if (
                  form.data.channelType === 22 &&
                  value &&
                  parseFloat(value) <
                      form.data.consumerSetting.usageDays
              ) {
                  callback(
                      '自动退/检票期限不能小于门票有效期'
                  )
                  return
              }
              callback()
          }
      }"
    >
      <SafeInputNumber
        style="width: 100%"
        v-model="form.data.autoCheckDays"
        :min="1"
        :max="27"
        :precision="0"
        placeholder="范围1~27天"
      />
      <form-item-tip>1.过期退/过期检时间 + 可选游玩日时间/可选游玩天数 <= 28天。2.可核销多次的门票，第一次核销则视为已核销</form-item-tip>
    </el-form-item>

    <!-- <div>form.data.channelType={{form.data.channelType}}</div>
<div>form.data.consumerSetting={{form.data.consumerSetting}}</div> -->
    <template
      v-if="form.data.channelType === 22 && form.data.consumerSetting"
    >
      <el-form-item
        label="检票方式"
        prop="consumerSetting.consumerWay"
        verify
      >
        <el-radio-group
          v-model="
              form.data.consumerSetting.consumerWay
          "
        >
          <el-radio-button label="0"
          >仅凭购票二维码检票
          </el-radio-button
          >
          <el-radio-button label="1"
          >凭身份证或购票二维码均检票
          </el-radio-button
          >
          <el-radio-button label="2"
          >仅凭身份证检票
          </el-radio-button
          >
        </el-radio-group>
      </el-form-item>

      <el-form-item
        label="门票有效期"
        prop="consumerSetting.usageDays"
        :rules="{
            required: true,
            trigger: ['blur', 'change'],
            validator: (rule, value, callback) => {
                if (!value) {
                    callback('必填项')
                    return
                }
                if (
                    form.data.autoCheckDays &&
                    parseFloat(
                        form.data.autoCheckDays
                    ) < value
                ) {
                    callback(
                        '门票有效期不能大于自动退/检票期限'
                    )
                    return
                }
                callback()
            }
        }"
      >
        <SafeInputNumber
          v-model="
              form.data.consumerSetting.usageDays
          "
          :step="1"
          step-strictly
          :min="1"
          :max="10"
          placeholder="范围1~10天"
          style="width: 100%"
        />
        <form-item-tip>
          1、门票有效期指含游玩日在内的几天有效，按自然日计算；2、自动退/检票期限>=门票有效期
        </form-item-tip>
      </el-form-item>

      <el-form-item
        label="门票使用次数"
        prop="consumerSetting.usageCount"
        verify
      >
        <SafeInputNumber
          v-model="
              form.data.consumerSetting.usageCount
          "
          :step="1"
          step-strictly
          :min="1"
          :max="99"
          placeholder="范围1~99天"
          style="width: 100%"
        />
        <form-item-tip>门票有效期内同一游客可重复使用次数</form-item-tip>
      </el-form-item>
    </template>
  </el-form>
</template>

<script>
import mixin from './mixin'

export default {
  name: 'CheckSettings',
  mixins: [mixin],
  data () {
    return {}
  },
  watch: {
    'form.data.consumerSetting': {
      deep: true,
      handler (nv, ov) {
        // 当为青岩古镇票务并且检票设置对象字段consumerSetting为null或者不存在的时候，设置检票设置对象字段的默认值
        if (this.form.data.channelType && this.form.data.channelType === 22) {
          this.initConsumerSetting(nv)
        }
      }
    },
  },
  methods: {
    /**
     * 设置检票设置默认值
     * @param {Object || Null }} target
     * @return Void
     */
    initConsumerSetting (target) {
      if (!target || !target.usageDays) {
        this.$set(this.form.data, 'consumerSetting', {})
        this.$set(this.form.data.consumerSetting, 'usageDays', 1)
        this.$set(this.form.data.consumerSetting, 'consumerWay', 1)
        this.$set(this.form.data.consumerSetting, 'usageCount', 1)
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
